import { defineConfig,loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'
// 引入svg需要用到的插件
// @ts-ignore
import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
// mock插件提供方法
// @ts-ignore
import { viteMockServe } from 'vite-plugin-mock'
export default defineConfig(({command,mode}) => {
  // 获取各种环境下对应的变量
  let evn = loadEnv(mode,process.cwd()) //mode默认开发模式，process.cwd()项目根目录（index.html 文件所在的位置）：加载mode环境的文件，以及这个文件的位置
  return {
    plugins: [vue(), createSvgIconsPlugin({
      iconDirs: [path.resolve(process.cwd(), 'src/assets/icons')],
      symbolId: 'icon-[dir]-[name]',
    }),
    viteMockServe({
      // @ts-ignore
      localEnabled: command === 'serve', //保证开发阶段可以使用mock接口
    }),
    ],
    resolve: {
      alias: {
        "@": path.resolve("./src") // 相对路径别名配置，使用 @ 代替 src
      }
    },
    // scss全局变量配置
    css: {
      preprocessorOptions: {
        scss: {
          javascriptEnabled: true,
          additionalData: '@import "./src/styles/variable.scss";',
        },
      },
    },
    // 代理跨域
    server:{
      proxy:{
        // 获取对应环境下代理跨域需要带的关键字:evn.VITE_APP_BASE_API : '/api'
        [evn.VITE_APP_BASE_API]: {
          target: evn.VITE_SERVE, //对应环境下 获取数据的服务器地址设置
          changeOrigin: true, //是否代理跨域
          rewrite: (path) => path.replace(/^\/api/, ''), //路径重写 /api替换为空串
          // 所有的接口前缀是没有/api的，所以发请求的时候需要把/api替换为空串，因为真实的服务器接口是没有/api的
        },
      }
    }
  }
})
